<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>用户信息</title>
  <meta name="renderer" content="webkit">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
  <link rel="stylesheet" href="../layui.css">
</head>
<body>
<div class="layui-row">
  <div class="layui-col-xs12">
    <div align="center" style="float: left;width: 80%;height: 80%;">    
      <fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
        <legend>基本信息</legend>
      <div class="layui-form" style="height: 250px">
        <button class="layui-btn layui-btn-primary layui-btn-sm" id="edit_person" style="float: right;"><i class="layui-icon">&#xe642;</i></button>
        <table class="layui-table" lay-even="" lay-skin="row" style="width: 80%">
          <thead >
            <tr rowspan="3" style="width:100px;">
                <div class="layui-upload">
                  <button type="button" class="layui-btn" id="test1">上传图片</button>
                  <div class="layui-upload-list">
                    <img class="layui-upload-img" id="demo1">
                    <p id="demoText"></p>
                  </div>
                </div>
            </tr>
          </thead>
        </table>

        <table class="layui-table" lay-even="" lay-skin="row" style="width: 80%">
            <thead>
              <tr>
                <th>人员编号</th>
                  <th>工号</th>
                  <th>姓名</th>
                  <th>联系方式</th>
              </tr> 
              </thead>
              <tbody>
              <tr>
                  <td id="id"></td>
                  <td id= "tSerial"></td>
                  <td id= "tName"></td>
                  <td id= "telephone"></td>
              </tr>
              </tbody>
        </table> 
      </div>
      </fieldset>
    </div>
  </div>
</div>
<div class="layui-row">
  <div class="layui-col-xs12">
    <div align="center" style="float: left;width: 80%;height: 80%;">    
      <fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
        <legend>其他信息</legend>
      <div class="layui-form">
        <table class="layui-table" lay-even="" lay-skin="row" style="width: 68%">
            <thead>
            <tr>
                <th>职位</th>
                <th>所在院</th>
                <th>所在系</th>
            </tr> 
            </thead>
            <tbody>
            <tr>
                <td id = "role"></td>
                <td id = "colleage"></td>
                <td id = "department"></td>
            </tr>
            </tbody>
        </table> 
      </div>
      </fieldset>
    </div>
  </div>
</div>
</div>
<script src="../layui.js" charset="utf-8"></script><!-- 注意：如果你直接复制所有代码到本地，上述js路径需要改成你本地的 -->
<script src="../jquery-3.1.1.min.js"></script>
<script>
  var loginName = "杨振刚";
  var loginSerial = "30000001";
  $.ajax({
    url:'/admin/user/login',
    type:'post',
    async:false,
    dataType:'json',
    data:{"tSerial":loginSerial},
    success:function(result){
      console.log(result.data.id);
      document.getElementById("id").innerHTML=result.data.id;
      document.getElementById("tSerial").innerHTML=result.data.tSerial;
      document.getElementById("tName").innerHTML=result.data.tName;
      document.getElementById("telephone").innerHTML=result.data.telephone;
      document.getElementById("role").innerHTML=result.data.role;
      document.getElementById("colleage").innerHTML=result.data.colleage;
      document.getElementById("department").innerHTML=result.data.department;
    },
    error:function(result){
      console.log(result);
    }
  });
  layui.use(['form', 'layedit', 'laydate','upload'], function(){
    var $ = layui.jquery;
    var form = layui.form;
    var layedit = layui.layedit;
    var upload = layui.upload;
      //普通图片上传
    var uploadInst = upload.render({
      elem: '#test1'
      ,url: '/upload/'
      ,before: function(obj){
        //预读本地文件示例，不支持ie8
        obj.preview(function(index, file, result){
          $('#demo1').attr('src', result); //图片链接（base64）
        });
      }
      ,done: function(res){
        //如果上传失败
        if(res.code > 0){
          return layer.msg('上传失败');
        }
        //上传成功
      }
      ,error: function(){
        //演示失败状态，并实现重传
        var demoText = $('#demoText');
        demoText.html('<span style="color: #FF5722;">上传失败</span> <a class="layui-btn layui-btn-mini demo-reload">重试</a>');
        demoText.find('.demo-reload').on('click', function(){
          uploadInst.upload();
        });
      }
    });
  });
</script>
</body>
</html>